{
    MyDesktop.storeNguoiLapPhieuHang = new Ext.data.Store({
                id       : 'storeNguoiLapPhieuHang',
                proxy    : new Ext.data.HttpProxy({
                            url    : '<?=BASE_URL?>/nhanvien/list-all',
                            method : 'POST'
                        }),
                reader   : new Ext.data.JsonReader({
                            root          : 'results',
                            totalProperty : 'total'
                        }, [{
                                name : 'NhanVienID'
                            }, {
                                name : 'TenNhanVien'
                            }]),
                autoLoad : true
            });

    MyDesktop.cboNguoiLapPhieuHang = new Ext.form.ComboBox({
                name          : 'NguoiLapPhieuHang',
                fieldLabel    : 'NguoiLapPhieu',
                width         : 170,
                height        : 24,
                bodyStyle     : 'padding:15px',
                store         : MyDesktop.storeNguoiLapPhieuHang,
                // id : 'SanPhamID',
                valueField    : 'NhanVienID',
                displayField  : 'TenNhanVien',
                hiddenName    : 'NguoiLapPhieuHang',
                typeAhead     : true,
                mode          : 'local',
                triggerAction : 'all',
                emptyText     : '- Choose -',
                selectOnFocus : true,
                editable      : false,
                allowBlank    : false
            });

    MyDesktop.cboNguoiLayHang = new Ext.form.ComboBox({
                name          : 'NguoiLayHang',
                fieldLabel    : 'NguoiLayHang',
                width         : 170,
                height        : 24,
                bodyStyle     : 'padding:15px',
                store         : MyDesktop.storeNguoiLapPhieuHang,
                // id : 'SanPhamID',
                valueField    : 'NhanVienID',
                displayField  : 'TenNhanVien',
                hiddenName    : 'NguoiLayHang',
                typeAhead     : true,
                mode          : 'local',
                triggerAction : 'all',
                emptyText     : '- Choose -',
                selectOnFocus : true,
                editable      : false,
                allowBlank    : false
            });

    MyDesktop.storeSanPham = new Ext.data.Store({
                id       : 'storeSanPham',
                proxy    : new Ext.data.HttpProxy({
                            url    : '<?=BASE_URL?>/sanpham/list-all',
                            method : 'POST'
                        }),
                reader   : new Ext.data.JsonReader({
                            root          : 'results',
                            totalProperty : 'total'
                        }, [{
                                name : 'SanPhamID'
                            }, {
                                name : 'TenSanPham'
                            }]),
                autoLoad : true
            });

    MyDesktop.cboSanPham = new Ext.form.ComboBox({
                name          : 'SanPhamID',
                fieldLabel    : 'SanPham',
                width         : 170,
                height        : 24,
                bodyStyle     : 'padding:15px',
                store         : MyDesktop.storeSanPham,
                // id : 'SanPhamID',
                valueField    : 'SanPhamID',
                displayField  : 'TenSanPham',
                hiddenName    : 'SanPhamID',
                typeAhead     : true,
                mode          : 'local',
                triggerAction : 'all',
                emptyText     : '- Choose -',
                selectOnFocus : true,
                editable      : false,
                allowBlank    : false
            });

    MyDesktop.RenderLoaiPhieuHang = function(value) {
        var arr = Array('Nhap Hang', 'Xuat Hang');
        return arr[value];
    }

    strLoaiPhieuHang = new Ext.data.SimpleStore({
                fields : ['value', 'id'],
                data   : [['Nhap Hang', '0'], ['Xuat Hang', '1']]
            });

    cboLoaiPhieuHang = new Ext.form.ComboBox({
                name          : 'LoaiPhieuHang',
                fieldLabel    : '<?=$this->translate->_("LoaiPhieuHang")?>',
                width         : 170,
                height        : 24,
                bodyStyle     : 'padding:15px',
                store         : strLoaiPhieuHang,
                valueField    : 'id',
                displayField  : 'value',
                hiddenName    : 'LoaiPhieuHang',
                typeAhead     : true,
                mode          : 'local',
                triggerAction : 'all',
                emptyText     : '- <?=$this->translate->_("Select value...")?> -',
                selectOnFocus : true,
                editable      : false,
                allowBlank    : false
            });

    MyDesktop.split = function(str) {
        if (str) {
            var result = str.toString();

            result = result.substring(0, 30)
            if (str.length > 30) {
                result = result + '...';
            }
            return result.replace('<', '&lt;');
        }
        return str;
    }

    MyDesktop.PhieuhangManagement = Ext.extend(Ext.app.Module, {
        createWindow : function() {
            var desktop = app.getDesktop();
            var win = desktop.getWindow('listPhieuhang');
            if (!win) {
                win = desktop.createWindow({
                    id          : 'listPhieuhang',
                    title       : "<?=$this->translate->_('Phieuhang Management')?>",
                    width       : <?=$this->winWidth?>,
                    height      : <?=$this->winHeight?>,
                    iconCls     : 'icon-grid',
                    layout      : 'border',
                    maximizable : false,

                    tbar        : [/*
                                     * { id : 'delete', text : "<?=$this->translate->_('Delete')?>",
                                     * icon : '<?=ICONS_PATH?>/delete16x16.png',
                                     * cls : "x-btn-text-icon", handler :
                                     * function() { // submit code here } }, {
                                     * id : 'newPhieuhang', text : "<?=$this->translate->_('New
                                     * Phieuhang')?>", icon : '<?=ICONS_PATH?>/newuser16x16.png',
                                     * cls : "x-btn-text-icon", handler :
                                     * function() { } },
                                     */{
                            id      : 'refresh',
                            text    : "<?=$this->translate->_('Refresh')?>",
                            icon    : '<?=ICONS_PATH?>/refresh16x16.png',
                            cls     : "x-btn-text-icon",
                            handler : function() {
                                MyDesktop.PhieuhangManagement.dataStore
                                        .reload();
                            }
                        }],

                    items       : [MyDesktop.PhieuhangManagement.listGrid,
                        MyDesktop.PhieuhangManagement.formAdd],

                    listeners   : {
                        close : function() {
                        }
                    }

                });
            }
            <?php
            if ($this->maximizeWin) {
            echo "win.maximize();";
            }
            ?>
            win.show();

        }
    });

    /**
     * Define Store
     */
    MyDesktop.PhieuhangManagement.dataStore = new Ext.data.Store({
        proxy    : new Ext.data.HttpProxy({
                    url    : '<?=BASE_URL?>/<?=$this->currentController?>/list',
                    method : 'POST'
                }),
        reader   : new Ext.data.JsonReader({
                    root          : 'results',
                    totalProperty : 'total',
                    id            : '<?=$this->pk?>'
                }, [{
                        name    : 'PhieuHangID',
                        mapping : 'PhieuHangID',
                        type    : 'int'
                    }, {
                        name    : 'MaSoPhieuHang',
                        mapping : 'MaSoPhieuHang'
                    }, {
                        name    : 'NguoiLapPhieuHang',
                        mapping : 'NguoiLapPhieuHang'
                    }, {
                        name    : 'NguoiLayHang',
                        mapping : 'NguoiLayHang'
                    }, {
                        name    : 'NgayLapPhieuHang',
                        mapping : 'NgayLapPhieuHang'
                    }, {
                        name    : 'NgayGiaoHang',
                        mapping : 'NgayGiaoHang'
                    }, {
                        name    : 'LoaiPhieuHang',
                        mapping : 'LoaiPhieuHang'
                    }, {
                        name    : 'SanPhamID',
                        mapping : 'SanPhamID'
                    }, {
                        name    : 'TenSanPham',
                        mapping : 'TenSanPham'
                    }, {
                        name    : 'SoLuong',
                        mapping : 'SoLuong'
                    }]),
        sortInfo : {
            field     : '<?=$this->pk?>',
            direction : "DESC"
        }
    });

    /**
     * Define Column Model
     */
    MyDesktop.PhieuhangManagement.columnModel = new Ext.grid.ColumnModel({
                defaults : {
                    sortable : true
                },
                columns  : [new Ext.grid.RowNumberer(), {
                        header    : 'PhieuHangID',
                        dataIndex : 'PhieuHangID',
                        hidden    : true
                    }, {
                        header    : 'MaSoPhieu',
                        dataIndex : 'MaSoPhieuHang',
                        width     : 65
                    }, {
                        header    : 'NguoiLapPhieuHang',
                        dataIndex : 'NguoiLapPhieuHang',
                        hidden    : true
                    }, {
                        header    : 'NguoiLayHang',
                        dataIndex : 'NguoiLayHang',
                        hidden    : true
                    }, {
                        header    : 'SanPhamID',
                        dataIndex : 'SanPhamID',
                        hidden    : true
                    }, {
                        header    : 'TenSanPham',
                        dataIndex : 'TenSanPham',
                        width     : 160
                    }, {
                        header    : 'SoLuong',
                        dataIndex : 'SoLuong',
                        width     : 65
                    }, {
                        header    : 'LoaiPhieu',
                        dataIndex : 'LoaiPhieuHang',
                        renderer  : MyDesktop.RenderLoaiPhieuHang,
                        width     : 65
                    }, {
                        header    : 'NgayLapPhieu',
                        dataIndex : 'NgayLapPhieuHang',
                        width     : 80
                    }, {
                        header    : 'NgayGiaoHang',
                        dataIndex : 'NgayGiaoHang',
                        width     : 80
                    }]
            });

    /**
     * Define Grid
     */
    MyDesktop.PhieuhangManagement.listGrid = new Ext.grid.EditorGridPanel({
                id           : 'Phieuhanggrid',
                title        : "<?=$this->translate->_('List')?>",
                store        : MyDesktop.PhieuhangManagement.dataStore,
                cm           : MyDesktop.PhieuhangManagement.columnModel,
                clicksToEdit : 1,
                region       : 'center',
                width        : 550,
                split        : true,
                selModel     : new Ext.grid.RowSelectionModel({
                            singleSelect : true,
                            listeners    : {
                                rowselect : function(sm, row, rec) {
                                    MyDesktop.PhieuhangManagement.formAdd
                                            .expand(true);
                                    MyDesktop.PhieuhangManagement.formAdd
                                            .getForm().loadRecord(rec);
                                    Ext.getCmp('SoLuongCu').setValue(Ext
                                            .getCmp('SoLuong').getValue());
                                }
                            }
                        }),
                listeners    : {
                    render : function() {
                        MyDesktop.PhieuhangManagement.dataStore.load();
                    }

                }
            });

    MyDesktop.PhieuhangManagement.formAdd = new Ext.FormPanel({
        id          : 'PhieuhangFormPanel',
        url         : '<?=BASE_URL?>/<?=$this->currentController?>/save',
        region      : "east",
        width       : 730,
        collapsible : true,
        split       : true,
        defaultType : 'textfield',
        autoScroll  : true,
        frame       : true,
        items       : [{
                fieldLabel : 'PhieuHangID',
                name       : 'PhieuHangID',
                id         : 'PhieuHangID',
                style      : 'width:98%',
                readOnly   : true
            }, {
                fieldLabel : "<?=$this->translate->_('MaSoPhieu')?>",
                name       : 'MaSoPhieuHang',
                id         : 'MaSoPhieuHang',
                style      : 'width:98%',
                allowBlank : false
            }, {
                fieldLabel : "<?=$this->translate->_('NgayLapPhieu')?>",
                name       : 'NgayLapPhieuHang',
                id         : 'NgayLapPhieuHang',
                style      : 'width:98%',
                xtype      : 'datefield',
                format     : 'Y-m-d'
            }, {
                fieldLabel : "<?=$this->translate->_('NgayGiaoHang')?>",
                name       : 'NgayGiaoHang',
                id         : 'NgayGiaoHang',
                style      : 'width:98%',
                xtype      : 'datefield',
                format     : 'Y-m-d'
            }, MyDesktop.cboNguoiLapPhieuHang, MyDesktop.cboNguoiLayHang,
            cboLoaiPhieuHang, MyDesktop.cboSanPham, {
                fieldLabel : "<?=$this->translate->_('SoLuong')?>",
                name       : 'SoLuong',
                id         : 'SoLuong',
                style      : 'width:98%',
                allowBlank : false
            }, {
                fieldLabel : "<?=$this->translate->_('SoLuong')?>",
                name       : 'SoLuongCu',
                id         : 'SoLuongCu',
                style      : 'width:98%',
                xtype      : 'hidden'
            }],
        tbar        : [{
            id      : "submitFormEditPhieuhang",
            text    : '<?=$this->translate->_("Save")?>',
            icon    : '<?=ICONS_PATH?>/save.gif',
            tooltip : '<?=$this->translate->_("Save to database")?>',
            handler : function() { // submit code here
                var form = MyDesktop.PhieuhangManagement.formAdd.form;
                form.submit({
                    waitMsg : '<?=$this->translate->_("Please wait")?>',
                    reset   : false,
                    success : function(f, a) {
                        // form.toBack();
                        var message = "<?=$this->translate->_('Can\'t save to DB!')?>";
                        try {
                            message = a.result.message;
                        } catch (ex) {
                        }
                        MyDesktop.PhieuhangManagement.dataStore.reload();
                        Ext.Msg.alert('<?=$this->translate->_("Status")?>',
                                message);
                    },
                    failure : function(f, a) {
                        // form.toBack();
                        var message = "<?=$this->translate->_('Your form is not valid!')?>";
                        try {
                            message = a.result.message;
                        } catch (ex) {
                        }
                        Ext.Msg.alert('<?=$this->translate->_("Status")?>',
                                message);
                    }
                });
            }
        }, {
            text    : '<?=$this->translate->_("Form Add")?>',
            icon    : '<?=ICONS_PATH?>/refresh16x16.png',
            cls     : "x-btn-text-icon",
            handler : function() {
                var form = MyDesktop.PhieuhangManagement.formAdd;

                form.getForm().reset();
            }

        }, {
            id      : 'Delete',
            text    : "<?=$this->translate->_('Delete')?>",
            icon    : '<?=ICONS_PATH?>/delete16x16.png',
            cls     : "x-btn-text-icon",
            handler : function() { // submit code here
                var form = MyDesktop.PhieuhangManagement.formAdd;

                var id = form.findById('<?=$this->pk?>').getValue();

                Ext.Ajax.request({
                    url     : '<?=BASE_URL?>/<?=$this->currentController?>/delete/id/'
                            + id,
                    success : function(r) {
                        MyDesktop.PhieuhangManagement.dataStore.reload();
                        Ext.Msg
                                .alert('<?=$this->translate->_("Status")?>',
                                        '<?=$this->translate->_("Delete successfull!")?>');
                        form.getForm().reset();
                    },
                    failure : function(r) {
                        Ext.Msg
                                .alert('<?=$this->translate->_("Status")?>',
                                        '<?=$this->translate->_("Request Fail! Please check your connection")?>');
                    }
                });
            }
        }]
    });

    var PhieuhangManagement = new MyDesktop.PhieuhangManagement();
    PhieuhangManagement.createWindow();

}